// 引入router下面的静态路由文件,第一个是静态路由第二个是动态路由
import { constantRoutes, asyncRoutes } from "@/router"
// 默认静态路由
const state = {
  // 初始的静态路由权限
  routes: constantRoutes
}
// 创建静态页面权限加上登录用户以及未登录用户而动态指定的权限
const mutations = {
  setRoutes(state, newRoutes) {
    // 这样写写不对，但并非语法不对而是业务不对，这样做路由动态情况会叠加导致权限叠加，
    // state.routes = [...state.routes, ...newRoutes]
    // 所以才用静态路由每一次更新之后的基础上追加新的权限路由
    state.routes = [...constantRoutes, ...newRoutes]
  }
}
// 权限验证方法
const actions = {
  // 在对象里创建方法
  // 第一个参数是代表动态路由得，名称地儿个参数代表用户拥有的参数权限
  filterRoutes(context, menus) {
    // 创建一个空数组接收双方共有的数据权限
    const arr = []
    // element代表每一个权限
    menus.forEach(element => {
      // 在遍历动态路由如果动态路由里面的每一个路由的name等于权限的名称name就书名拥有权限
      arr.push(...asyncRoutes.filter(ITEM => ITEM.name === element))

    });
    // 将动态路由给上面主策得mutations函数
    context.commit("setRoutes",arr)
    // // 这里为什么还要return  state数据 是用来 显示左侧菜单用的  return  是给路由addRoutes用的
    return arr
  }
}
// 向外导出方法
export default {
  namespaced: true,
  state,
  mutations,
  actions
}